'use strict';
/*
* 领券中心
* */
import React,{Component} from 'react';
import {
    View,
    Text,
    Image,
    ScrollView,
    TouchableOpacity,
    StyleSheet
} from 'react-native'
import Header from '../../common/header';
import MyStroage from "../../common/myStroage";
import Login from '../../userCenter/login';
import Util from '../../common/util';
import * as URLconstant from '../../constant/URLconstant'
import Toast from '../../common/ToastUtil';
export default class receiveCenter extends Component{
    // 构造
      constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            couponData:null
        };
      }


    async componentDidMount() {
        let userInfoDate = await MyStroage.getStorageAllDataForKey('userinfo')
        if(userInfoDate){
            this.setState({
                user_id:userInfoDate.data.user_id
            })
            this.getCoupon()
        }else{
            this.props.navigation.push('Login',{
                isPop:1,
                callback: ()=>{
                    this.getAgain()
                }
            })
        }
    }

    async getAgain() {
        let userInfoDate = await MyStroage.getStorageAllDataForKey('userinfo')
        if(userInfoDate){
            this.setState({
                user_id:userInfoDate.data.user_id
            })
            this.getCoupon()
        }
    }

    getCoupon(){
          let url = URLconstant.RECEIVE_CENTER
        let datakey=[]
        datakey['user_id']=this.state.user_id
        Util.get(url,datakey,this.getCouponSuc.bind(this),this.errorCallback.bind(this))
    }
    getCouponSuc(datas){
          let couponData = []
        if(datas.status==0){
            couponData=datas.data
        }
        this.setState({
            couponData:couponData
        })
    }
    errorCallback(err){

    }

    backBg(item){
          if(item.is_overdue==1){
              return(
                  <Image
                      source={{uri:'http://tpsite.oss-cn-hangzhou.aliyuncs.com/tpimg/4e2b3288479ed1c899152396087772d43a2ac703.png'}}
                      resizeMode={'cover'}
                      style={styles.coupon_bg}
                  />
              )
          }else if(item.is_lingqu==0&&item.is_use==0){
              return(
                  <Image
                      source={{uri:'http://tpsite.oss-cn-hangzhou.aliyuncs.com/tpimg/b683ffecbf3b1f46e49f9cbf666c01ae36d8d5f4.png'}}
                      resizeMode={'cover'}
                      style={styles.coupon_bg}
                  />
              )
          }else if(item.is_lingqu==1&&item.is_use==0){
              return(
                  <Image
                      source={{uri:'http://tpsite.oss-cn-hangzhou.aliyuncs.com/tpimg/79d3373ce5ab3d8891d050cad359aa77ba200218.png'}}
                      resizeMode={'cover'}
                      style={styles.coupon_bg}
                  />
              )
          }else{
              return(
                  <Image
                      source={{uri:'http://img.tpsite.ecduo.cn/yanfa3.tpsite.qushiyun.com/5cd3e371bd13e.png'}}
                      resizeMode={'cover'}
                      style={styles.coupon_bg}
                  />
              )
          }
    }

    //领取优惠券
    receiveCoupon(item){
          let url = URLconstant.GET_COUPON
        let datakey=[]
        datakey['coupon_type_id']=item.coupon_type_id
        datakey['user_id']=this.state.user_id
        let that = this
        Util.get(url,datakey,(datas)=>{
            if(datas.status==0){
                Toast.show(datas.msg)
                that.getCoupon()
            }else{
                if(item.is_overdue==1){
                    Toast.show('优惠券已过期')
                }else if(item.is_lingqu==1){
                    Toast.show('优惠券已领取')
                }else if(item.is_use){
                    Toast.show('优惠券已领取并已使用')
                }
            }
        },this.errorCallback.bind(this))
    }

    showCoupon(){
          let couponData = this.state.couponData
        return(
            <View style={{padding:10}}>
                {
                    couponData.map((item,index)=>{
                        return(
                            <TouchableOpacity onPress={()=>this.receiveCoupon(item)} key={index} style={styles.coupon_item}>
                                {this.backBg(item)}
                                <View style={styles.coupon_info}>
                                    <View style={styles.coupon_left}>
                                        <View style={styles.coupon_price_view}>
                                            <Text style={{fontSize:12,color:"#000",marginBottom:5}}>¥</Text>
                                            <Text style={{fontSize:30,color:"#000"}}>{item.coupon_value}</Text>
                                        </View>
                                        <Text style={{fontSize:12,color:"#000"}}>满{item.min_goods_order}可用</Text>
                                    </View>
                                    <View style={{flex:1,backgroundColor:'transparent'}}>
                                        <Text style={{fontSize:14,color:"#000",marginBottom:10}} numberOfLines={1}>{item.coupon_name}</Text>
                                        <Text style={{fontSize:12,color:"#696969"}}>{item.start_time}-{item.end_time}</Text>
                                    </View>
                                </View>
                            </TouchableOpacity>
                        )
                    })
                }
            </View>
        )
    }


      render(){
          return(
              <View style={{flex:1,backgroundColor:"#f0f0f0"}}>
                  <Header navigation={this.props.navigation} title={'领券中心'}/>
                  {
                      this.state.couponData==null?
                          <View style={{flex:1}}>
                              {Util.loading()}
                          </View>:
                          <View style={{flex:1}}>
                              {
                                  this.state.couponData.length==0?
                                  <View style={{flex:1,alignItems:"center",justifyContent:'center'}}>
                                      <Text>没有优惠券数据</Text>
                                  </View>:
                                  <View style={{flex:1}}>
                                      {this.showCoupon()}
                                  </View>
                              }
                          </View>
                  }
              </View>
          )
      }
}
var styles =StyleSheet.create({
    coupon_item:{
        width:Util.size.width-20,
        height:(Util.size.width-20)/4,
        marginBottom:10
    },
    coupon_bg:{
        width:Util.size.width-20,
        height:(Util.size.width-20)/4
    },
    coupon_info:{
        position:"absolute",
        top:10,
        left:10,
        width:(Util.size.width-20)*0.8,
        height:(Util.size.width-20)/4-20,
        justifyContent:'center',
        flexDirection:"row",
        alignItems:'center'
    },
    coupon_left:{
        width:(Util.size.width-20)*0.25,
        backgroundColor:'transparent',
    },
    coupon_price_view:{
        flexDirection:'row',
        backgroundColor:'transparent',
        alignItems:'flex-end'
    }
})